// import React from './react';
// import ReactDOM from './react-dom';
import React from 'react';
import ReactDOM from 'react-dom';

// const ele = (<div id='app' style={{ color: 'red', fontSize: '20px' }}> <div>1</div> <h1>hhhh</h1></div>);
// function FunctionComp(props) {
//     return <div>我是{props.msg}组件</div>
// }

class ClassComp extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            a: 1,
            b: 2
        }
    }
    handleClick = () => {
        setTimeout(() => {
            this.setState({
                a: this.state.a + 1
            });
            console.log(this.state.a);
        })
    }
    render() {
        return (
            <div>
                <h1>{this.state.a}</h1>
                <button onClick={this.handleClick}>加1</button>
            </div>
        )
    }
}
// ReactDOM.render(ele, document.getElementById('root'));
// ReactDOM.render(<FunctionComp msg="函数" />, document.getElementById('root'));
ReactDOM.render(<ClassComp msg="类" />, document.getElementById('root'));
